<!--
 * @Date: 2025-07-29 17:32:39
 * @Description: 大区子账号
 * @LastEditTime: 2025-08-28 17:17:54
-->
<template>
  <div class="sub-account">
    <el-form :inline="true" :model="formInline" class="demo-form-inline">
      <el-form-item label="账号/姓名/邮箱">
        <br />
        <el-input v-model="formInline.userName" @keyup.enter.native="search" style="margin-left:-110px;width:200px"
          placeholder="请输入账号/姓名/邮箱" clearable></el-input>
      </el-form-item>
      <el-form-item label="电话">
        <br />
        <el-input v-model="formInline.tel" style="margin-left:-45px;width:200px" @keyup.enter.native="search"
          placeholder="请输入电话" clearable></el-input>
      </el-form-item>
      <el-form-item label="营销区域">
        <br />
        <el-select v-model="formInline.orgSeqName" style="margin-left:-70px;width:200px" @keyup.enter.native="search"
          clearable>
          <el-option v-for="item in RentalPayWay" :key="item.id" :label="item.name" :value="item.name" />
        </el-select>
      </el-form-item>

      <el-form-item style="margin-top:40px">
        <el-button type="primary" icon="el-icon-search" @click="search()">查询</el-button>
        <el-button type="primary" @click="kong()" icon="el-icon-delete">清空</el-button>
        <el-button type="primary" @click="edit()" icon="el-icon-plus">新增账号</el-button>
      </el-form-item>
    </el-form>

    <el-table :data="tableData" border v-loading="loading" height="600px"
      :header-cell-style="{ background: '#eef1f6', color: '#606266' }">
      <el-table-column type="index" label="序号" align="center" width="60"></el-table-column>
      <!-- <el-table-column prop="accounts" label="账号" width="130"></el-table-column> -->
      <el-table-column prop="userName" label="账号" width="130" header-align="center"></el-table-column>
      <el-table-column prop="roleList[0].userType" label="账号类型" width="180" header-align="center">
        <template slot-scope="scope">
          <span v-if="scope.row.userType == 1">总部</span>
          <span v-if="scope.row.userType == 2">大区</span>
          <span v-if="scope.row.userType == 3">营销区域业务经理</span>
          <span v-if="scope.row.userType == 4">店主</span>
          <span v-if="scope.row.userType == 5">店长</span>
          <span v-if="scope.row.userType == 6">门店业务员</span>
        </template>
      </el-table-column>
      <!-- <el-table-column prop="roleList[0].roleName" label="所属角色" width="180" header-align="center"></el-table-column> -->

      <el-table-column prop="orgList[0].orgName" label="所属营销区域" width="180" header-align="center">
        <template slot-scope="{ row }">
          <div>
            <p v-for="(orgName, index) in row.orgList" :key="index">
              {{ orgName.orgName }}
            </p>
          </div>
        </template>
      </el-table-column>
      <el-table-column prop="realName" label="姓名" width="130" header-align="center"></el-table-column>
      <!-- <el-table-column prop="email" label="邮箱" width="180" header-align="center"></el-table-column> -->
      <el-table-column prop="tel" label="电话" width="120" header-align="center"></el-table-column>

      <el-table-column prop="date" label="状态" align="center">
        <template slot-scope="scope">{{
          scope.row.status === 0 ? '禁用' : '启用'
        }}</template>
      </el-table-column>
      <el-table-column prop="createTime" label="创建时间" width="180" header-align="center"></el-table-column>
      <el-table-column prop="createUser" label="创建人" width="180" header-align="center"></el-table-column>
      <el-table-column label="操作" width="180" align="center" fixed="right">
        <template slot-scope="scope">
          <el-button size="mini" @click="edit(scope.row)" type="text">编辑</el-button>
          <el-button size="mini" @click="handleClick(scope.row)" v-if="scope.row.status === 0"
            type="text">启用</el-button>
          <el-button size="mini" @click="handleClick(scope.row)" v-if="scope.row.status === 1"
            type="text">禁用</el-button>
          <el-button type="text" size="mini" @click="reset(scope.row)">重置密码</el-button>
        </template>
      </el-table-column>
    </el-table>

    <div class="block" style="margin-top:2px">
      <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
        :page-sizes="[10, 20, 30, 50, 100]" :current-page="listQuery.current" :page-size="listQuery.size"
        layout="total, sizes, prev, pager, next, jumper" :total="total"></el-pagination>
    </div>
  </div>
</template>

<script>
import { accountlist, usebuttonone } from '@/api/platformmanage';
import { resetPassword } from "@/api/loginApi";
import { getAllBase } from '@/api/addShopapply.js';
import AccountList from './accountList.vue';
import qs from 'qs';
export default {
  components: {
    AccountList,
  },
  data() {
    return {
      loading: false,
      formInline: {
        userName: '',
        tel: '',
        orgSeqName: '',
        userType: '',
        // upOrgSeq: '',
      },
      total: 0,
      listQuery: {
        current: 1,
        size: 10,
      },
      tableData: [],
      userInfo: {},
      RentalPayWay: [],
    };
  },
  created() {
    const logininfo = localStorage.getItem('logininfo') || '{}';
    this.userInfo = JSON.parse(logininfo);
    // this.formInline.upOrgSeq = this.userInfo.orgSeq;
    this.selCore(this.userInfo.orgSeq);
    this.search();
    // if(this.userInfo.orgName){
    //   // this.formInline.orgSeqName = this.userInfo.orgName
    //   // this.formInline.upOrgSeqName = this.userInfo.orgName
    //   // this.search();
    // }
  },
  methods: {
    selCore(value) {
      if (value != '' && value != undefined && value != null) {
        this.orgSeq = value;
        let data = {
          code: value,
        };
        getAllBase(data).then((res) => {
          this.RentalPayWay = res.result;
        });
      }
    },
    search() {
      this.listQuery.current = 1;
      this.accountlist();
    },
    accountlist() {
      this.loading = true;
      let data = {
        size: this.listQuery.size,
        current: this.listQuery.current,
        condition: {
          userName: this.formInline.userName,
          userType: this.formInline.userType,
          tel: this.formInline.tel,
          orgSeqName: this.formInline.orgSeqName,
          upOrgSeq: this.userInfo.orgSeq
        },
        ascs: ['user_type'],
        descs: [],
      };
      accountlist(data)
        .then((res) => {
          this.tableData = res.records;
          this.total = res.total;
        })
        .finally(() => {
          this.loading = false;
        });
    },
    handleSizeChange(val) {
      this.listQuery.size = val;
      this.accountlist();
    },
    handleCurrentChange(val) {
      this.listQuery.current = val;
      this.accountlist();
    },
    kong() {
      this.formInline = this.$options.data().formInline;
    },
    handleClick(v) {
      if (v.status === 0) {
        var uuid = 1;
      } else if (v.status === 1) {
        var uuid = 0;
      }
      let data = { userId: v.userId, status: uuid, tel: v.tel };
      usebuttonone(data).then((res) => {
        this.accountlist();
        this.$message({
          showClose: true,
          message: res.message,
          type: 'success',
        });
      });
    },
    reset(v) {
      let data = { authId: v.userName, password: '888888' };
      resetPassword(qs.stringify(data)).then((res) => {
        this.$message({
          showClose: true,
          message: '密码重置成功',
          type: 'success',
        });
      });
    },

    edit(v) {
      const params = {
        flag3: true,
        flagmi: true,
        type: '3'  // 3 大区子账号
      }
      if (v) {
        params.edit = v
        params.flagmi = false
      }
      this.$router.push({
        name: 'subAccountEdit',
        params
      });
    }
  },
};
</script>

<style lang="less" scoped>
.sub-account {}
</style>
